/**
 * 封装ajax
 */

class Ajax {
    constructor(executor) {
        this.xhr= null
        executor(this.createXhr)
    }
    createXhr() {
        if(window.XMLHttpRequest) {
            this.xhr = new XMLHttpRequest()
        }else {
            this.xhr = new ActiveXObject()
        }
    }

    static get(method, url, params){
        this.xhr(method, url, params)
        this.xhr.onReadystatechange=()=> {
            if(this.xhr.readySate === 2){
                console.log('接受到响应头')
            }else if(this.xhr.readyState === 3) {
                console.log('响应体加载中')
            }else  if(this.xhr.readyState === 4) {
                console.log('响应体加载完成！这里进行后续操作！')
            }
        }
    }
}

/*
* 0： 建立来xhr， 还没发起请求，还没发起open请求。
* 1： 进行连接， open方法被调用
* 2： 连接完成， send方法被调用， 接受响应头
* 3： 响应体的返回
* 4： 响应体下载完毕， 可以进行其他的操作了。
*
*
* ajax的第三个参数为 是否异步， 默认的是 true，
* 也就是不用等待这完成， 可以先执行下面的任务， 不用等待
*
* 如果第三个参数设置为false， 那么就是同步的， 必须等待这个玩意儿没收到数据， 才能进行后续的其他操作。
*
* */


function get() {
    let xhr = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP');
    xhr.open('method', 'url', 'isAsync')
    xhr.send()
    if(xhr.onreadystatechange){
        if(xhr.readyState === 4){
            console.log('获取到数据')
        }
    }
}

function post() {
    let xhr = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP');

    xhr.open('method', 'url', 'isAsync')
    // 设置请求头的格式， 告诉服务器传输的数据格式是什么。
    xhr.setRequestHeader("content-Type","application/x-www-form-urlencoded")
    // 这里使用的是和url中query一样的格式
    xhr.send('name=ck&age=20')

    if(xhr.onreadystatechange) {
        if(xhr.readyState === 4) {
            console.log(xhr.responseText)
        }
    }
}
/*
* post方法， 或者传值的三种方法：
* 1. query格式: name=ck&age=18
* 2. 对象的字符串格式： {"name":"ck", "age":18}
* 2. JSON.stringfy({name:"ck", age:18}), 将方法二中的参数转成字符串格式的
* */

function AjaxCK(method, url, params, done ){
    let xhr = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHTTP')

    const urlParams = []
    for(let k in params) {
        urlParams.push(params[k])
    }
    const urlParam = urlParams.join('&')

    if(method === 'get'){
        url += "?" +urlParam
    }
    xhr.open(method, url)

    if(method === 'post') {
        xhr.setRequestHeader('content-type',
            'application/x-www-from-urlencoded')
    }
    xhr.send(data)

    xhr.onreadystatechange= () => {
        if(xhr.readyState === 4 ){
            // 记住这里， 要把需要的参数通过一个回调函数返回出去
            done(JSON.parse(xhr.responseText))
        }
    }
}


AjaxCK('get','xxx', {
    name: 'ck',
    age:12
},data=>{
//    这里是一个回调函数， 是一个函数， 返回的数是网络请求到的值
    console.log(data)
})

// Ajax有一个问题， 没办法使用Promise进行异步等操作。
